<%@ page language="java" contentType="text/html;" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<c:set var="ctx" value="${pageContext.request.contextPath}" />
<!DOCTYPE html>
<html>
<head>
<jsp:include page="../inc.jsp"></jsp:include>
<script type="text/javascript" src="${ctx}/jslib/layer/layer.js" charset="utf-8"></script>
<link rel="stylesheet" type="text/css" href="${ctx }/jslib/nationality/Content/main.css" />
<style>
		body,html,ul,ol,dl,li,dt,dd,p,h1,h2,h3,h4,h5,h6,form,input,table,fieldset,legend,img{margin:0; padding:0;}
		ul,li{list-style:none;}
		a{text-decoration:none; color:#333;}
		img{display:block;}
		img,fieldset{border:none;}
		body{font-family:"微软雅黑"; font-size:12px;}
        .blue_btn{
            width:114px;
            height:26px;
            background: #34c0e3;
            color: #FFFFFF;
            margin:5px 5px 0 -70px;
            border:1px solid #34c0e3;
            -moz-border-radius: 3px;      /* Gecko browsers */
            -webkit-border-radius: 3px;   /* Webkit browsers */
            border-radius:3px;
            cursor:pointer;
        }
        .grey_btn{
            width:114px;
            height:26px;
            background: #999999;
            color:white;
            text-align: center;
            line-height: 26px;
            font-size: 12px;
            border:none;
            -moz-border-radius: 3px;      /* Gecko browsers */
            -webkit-border-radius: 3px;   /* Webkit browsers */
            border-radius: 3px;
            cursor:pointer;
        }
		.blue_btn{
			background:#34c0e3;
		}
		.grey_btn{
			background:#999999;
		}
		#information{
			width:500px;
			height:350px;
			border:1px solid #999;
			margin: 0 auto;
		}
		p{
			margin-top:15px;
		}
		b{
			display: inline-block;
			font-weight: normal;
			width:90px;
			text-align: right;			
		}
		.engName{
			margin-top:20px;
		} 
		.chiName input{
			background:white;
		}
		.chiName{
			margin-top:8px;
		}
		.engName input,.chiName input{
			width:62px;
			height:18px;
		}
		.engName input:first-of-type{
			margin-right:20px;
		}
		.chiName input:first-of-type{
			margin-right:20px;
		}
		.star{
			color: red;
		} 
		.nocolor{
			background: white;
		}		
		.sex input{
			margin-left:20px;
		}
		.man input:last-child{
			margin-left:8px;
		}
		.move{
			margin-left:5px;
			width:177px;
		}
		.anniu{
			margin-top:40px;
			padding-left:90px;
		}
		 #table td{
		 	height:30px;
		 }
	</style>
<script type="text/javascript">
$(function(){
	 //国籍为必填项
	 $("#nationality").hover(function (){  
		 empty($("#nationality"),$("#img1")); 
    },function (){  
   	 empty($("#nationality"),$("#img1"));
    });  
	 //签发国家为必填项
	 $("#issueCountry").hover(function (){  
		 empty($("#issueCountry"),$("#img2")); 
    },function (){  
   	 empty($("#issueCountry"),$("#img2"));
    }); 
});
progressLoad();
$.ajax({
	type:'get',
	url:'${ctx}/order/getPassenger/${id}',
	dataType:'json',
	success:function(data){
		progressClose();
		if(data.success){
			$("#lastNameEn").val(data.obj.lastName_en);
			$("#firstNameEn").val(data.obj.firstName_en);
			$("#lastNameCn").val(data.obj.lastName_cn);
			$("#firstNameCn").val(data.obj.firstName_cn);
			$("input[type=radio][name=sex][value="+data.obj.sex+"]").attr("checked",true);  
			$("input[type=radio][name=passageType][value="+data.obj.passageType+"]").attr("checked",true);  
			$("#docType").combobox('setValue',data.obj.docType);
			$("#docId").val(data.obj.docId);
			$("#docExpireDate").datebox('setValue',data.obj.docExpireDate);
			$("#birthDate").datebox('setValue',data.obj.birthDate);
			$("#mobile").val(data.obj.mobile);
			$("#nationality").val(data.obj.nationality);
			$("#issueCountry").val(data.obj.issueCountry);
			$("#grogshop").val(data.obj.grogshop);
			$("#throughTraffic").val(data.obj.throughTraffic);
			$("#remark").val(data.obj.remark);
		}
		else{
			layer.alert(data.msg);
		}
	},
	error:function(msg){
		progressClose();
		layer.alert("请检查您的网络连接，然后重试！");
	}
}); 
function submitPay(){
	progressLoad();
	var isValid = $('#dataForm').form('validate');
	if (!isValid) {
		progressClose();
		return;
	};
	if($("#nationality").val() == "" || $("#issueCountry").val() == ""){
		layer.alert("请填写完整信息");
		progressClose();
		return;
	}
	var obj = {
            "id": "${id}",
            "lastName_en": $("#lastNameEn").val(),
		    "firstName_en": $("#firstNameEn").val(),
			"lastName_cn": $("#lastNameCn").val(),
			"firstName_cn": $("#firstNameCn").val(),
			"sex": $("input[name='sex']:checked").val(),
			"passageType": $("input[name='passageType']:checked").val(),
			"docType": $("#docType").combobox('getValue'),
			"docId": $("#docId").val(),
			"docExpireDate": $("#docExpireDate").datebox('getValue'),
			"birthDate": $("#birthDate").datebox('getValue'),
			"mobile": $("#mobile").val(),
			"nationality": $("#nationality").val(),
			"issueCountry": $("#issueCountry").val(),
			"grogshop": $("#grogshop").val(),
			"throughTraffic": $("#throughTraffic").val(),
			"remark": $("#remark").val()
	        }
	$.ajax({
		type:'post',
		url:'${ctx}/order/editPassenger',
		contentType:'application/json;charset=utf-8',
		data:JSON.stringify(obj),
		success:function(data){
			if(data.success){
				layer.alert('保存成功！',{skin:'layui-layer-lan',title: ['系统提示', 'background-color:#00B2EE; color:#fff;'],closeBtn: 0}, function(index){
					closeWin();
					layer.close(index);
				});
			}
			else{
				layer.alert(data.msg);
			}
		},
		error:function(msg){
			layer.alert("请检查您的网络连接，然后重试！");
		}
	}); 
};
//判断输入框结果不能为空
function empty(obj,img){
	$("#img1").hide();
	$("#img2").hide(); 
	//alert(obj.val());
	if(obj.val() == ""){
		img.show();
	}else{
		img.hide();
	};
};
var index = parent.layer.getFrameIndex(window.name); //获取窗口索引
function closeWin(){
	 parent.layer.close(index);
}
</script>
</head>
<body>
<form id="dataForm">
					<table id="table" border="0" cellpadding="5"  style="width: 90%">
						<tr>
							<td width="30%" align="right">英文姓名：</td>
							<td class='engName'>
							 姓<input type='text' id="lastNameEn" class="easyui-validatebox" data-options="required:true" validtype="english"/>
							 名<input type='text' id="firstNameEn" class="easyui-validatebox" data-options="required:true" validtype="english"/>
							</td>
						</tr>
						<tr>
							<td align="right">中文姓名：</td>
							<td class='chiName'>
							姓<input type='text' id="lastNameCn" class="easyui-validatebox" validtype="chinese"/>
							名<input type='text' id="firstNameCn" class="easyui-validatebox"  validtype="chinese"/>
							</td>
						</tr>
						<tr>
							<td align="right">性别：</td>
							<td class='sex'>
							<input type='radio' name='sex' checked="checked" value="1"/> 男<input type='radio' name='sex' value="2"/> 女
							</td>
						</tr>
						<tr>
							<td align="right">旅客类型：</td>
							<td class='sex man'>
							<input type='radio' name='passageType' checked="checked" value="1"/> 成人<input type='radio' name='passageType' value="2"/> 儿童
							</td>
						</tr>
						<tr>
							<td align="right">手机号：</td>
							<td class='phoneNum'>
							<input id="mobile" style="width:195px;height:20px" type='text' class="easyui-validatebox" validtype="mobile"/>
							</td>
						</tr>
						<tr>
							<td align="right">证件类型：</td>
							<td class='certificate'>
							<select class="easyui-combobox" id="docType" style="width:200px;height:20px" data-options="required:true,editable:false">
								<option value="1">身份证</option>
								<option value="2" selected="selected">护照</option>
							</select>
							</td>
						</tr>
						<tr>
							<td align="right">证件号：</td>
							<td class='certificateNum'>
							<input type='text'id="docId"  style="width:195px;height:20px" class="easyui-validatebox" data-options="required:true" validtype="charnum" />
							</td>
						</tr>
						<tr>
							<td align="right">证件有效期：</td>
							<td class='certificateDate'>
							<input type='text' id="docExpireDate" style="width:200px;height:20px" class="easyui-datebox"  data-options="required:true,validType:'date'"/>
							</td>
						</tr>
						<tr>
							<td align="right">出生日期：</td>
							<td class='birthday'>
							<input type='text' id="birthDate" style="width:200px;height:20px" class="easyui-datebox"  data-options="required:true,validType:'date'"/>
							</td>
						</tr>
						<tr>
							<td align="right">国籍：</td>
							<td class='birthday'>
							<div class="control-nationality-suggest">
								<input type="text" id="nationality" class="nationality-suggest-input" style="width:195px;height:20px"/>
								<div class="nationality-suggest-list-container">
									<div class="nationality-suggest-hint">输入中英文/代码搜索或&uarr;&darr;选择</div>
									<ul class="nationality-suggest-list"></ul>
								</div>
							</div>
							</td>
						</tr>
						<tr>
							<td align="right">签发国家：</td>
							<td class='birthday'>
							<div class="control-nationality-suggest">
								<input type="text" id="issueCountry" class="nationality-suggest-input" style="width:195px;height:20px"/>
								<div class="nationality-suggest-list-container">
									<div class="nationality-suggest-hint">输入中英文/代码搜索或&uarr;&darr;选择</div>
									<ul class="nationality-suggest-list"></ul>
								</div>
							</div>
							</td>
						</tr>
						<tr>
							<td align="right">酒店：</td>
							<td class='birthday'>
							<input type='text' id="grogshop" style="width:195px;height:20px"class="easyui-validatebox" />
							</td>
						</tr>
						<tr>
							<td align="right">联运：</td>
							<td class='birthday'>
							<input type='text' id="throughTraffic" style="width:195px;height:20px" class="easyui-validatebox" />
							</td>
						</tr>
						<tr>
							<td align="right">备注：</td>
							<td class='birthday'>
							<input type='text' id="remark" style="width:195px;height:50px" class="easyui-validatebox"  data-options="multiline:true"/>
							</td>
						</tr>
					</table>
				<div style="height: 50px;text-align: center;" >
                    <input type="button" value="确认修改" class="blue_btn" onclick="submitPay();">
                    <input type="button" value="取消" class="grey_btn" onclick="closeWin();">
				</div>
			</form>
<script src="${ctx }/jslib/nationality/Scripts/nationality.js"></script>
<script src="${ctx }/jslib/nationality/Scripts/main.js"></script>
</body>
</html>